<?php echo $header; ?>
<div id="content">
  <div class="breadcrumb">
    <?php foreach ($breadcrumbs as $breadcrumb) { ?>
    <?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
    <?php } ?>
  </div>
  <div class="box">
    <div class="heading">
      <h1><img src="view/image/mail.png" alt="" /> <?php echo $heading_title; ?></h1>
      <div class="buttons"><a id="button-send" onclick="send('index.php?route=sale/contact/send&token=<?php echo $token; ?>');" class="button"><?php echo $button_send; ?></a><a onclick="location = '<?php echo $cancel; ?>';" class="button"><?php echo $button_cancel; ?></a></div>
    </div>
    <div class="content">
        <table id="mail" class="form">
          <tr>
            <td><?php echo $entry_to; ?></td>
            <td>
              <select name="to">
                <option value="newsletter"><?php echo $text_newsletter; ?></option>
                <option value="customer_all"><?php echo $text_customer_all; ?></option>
                <option value="customer_grade"><?php echo $text_customer_grade; ?></option>
                <option value="customer"><?php echo $text_customer; ?></option>
              </select>
            </td>
          </tr>
          <tbody id="to_customer_grade" class="to">
            <tr>
              <td><?php echo $entry_customer_grade; ?></td>
              <td>
                <select name="customer_grade_id">
                  <?php foreach ($customer_grades as $customer_grade) { ?>
                  <option value="<?php echo $customer_grade['customer_grade_id']; ?>" title="<?php echo $customer_grade['name']; ?>"><?php echo $customer_grade['display_name']; ?></option>
                  <?php } ?>
                </select>
              </td>
            </tr>
          </tbody>
          <tbody id="to_customer" class="to">
            <tr>
              <td><?php echo $entry_customer; ?></td>
              <td><input type="text" name="customers" value="" /></td>
            </tr>
            <tr>
              <td></td>
              <td>
                <table class="list">
	              <thead>
	                <tr>
	                  <td class="center"><?php echo $column_customer_name; ?></td>
	                  <td class="center"><?php echo $column_email; ?></td>
	                  <td class="center"><?php echo $column_grade_name; ?></td>
	                  <td></td>
	                </tr>
	              </thead>
	              <tbody id="tbody_customer_search"></tbody>
	            </table>
			  </td>
            </tr>
          </tbody>
          <tr>
            <td><?php echo $entry_subject; ?></td>
            <td><input type="text" name="subject" value="" size="100"/></td>
          </tr>
          <tr>
            <td><?php echo $entry_message; ?></td>
            <td><textarea name="message"></textarea></td>
          </tr>
        </table>
    </div>
  </div>
</div>
<script type="text/javascript" src="view/javascript/ckeditor/ckeditor.js"></script> 
<script type="text/javascript" src="view/javascript/ckeditor/adapters/jquery.js"></script> 
<script type="text/javascript"><!--
$('textarea[name=\'message\']').ckeditor({
	filebrowserBrowseUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
	filebrowserImageBrowseUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
	filebrowserFlashBrowseUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
	filebrowserUploadUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
	filebrowserImageUploadUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
	filebrowserFlashUploadUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>'
});
//--></script> 
<script type="text/javascript"><!--	
$('select[name=\'to\']').bind('change', function() {
	$('#mail .to').hide();
	$('#mail #to_' + $(this).attr('value')).show();
});
$('select[name=\'to\']').trigger('change');
//--></script>
<script type="text/javascript"><!--
$customer_rows = 0;
$('input[name=\'customers\']').autocomplete({
	delay: 0,
	source: function(request, response) {
		$.ajax({
			url: 'index.php?route=customer/customer/autocomplete&token=<?php echo $token; ?>&filter_email=' +  encodeURIComponent(request.term),
			dataType: 'json',
			success: function(json) {
				response($.map(json, function(item) {
					return {
						label: item.email,
						value: item.customer_id,
						name: item.name,
						grade_name: item.grade_name
					}
				}));
			}
		});
	}, 
	select: function(event, ui) {
		$html = '<tr>';
		$html += '<td class="left">' + ui.item.firstname + ' ' + ui.item.lastname + '</td>';
		$html += '<td class="left">' + ui.item.label + '</td>';
		$html += '<td class="left">' + ui.item.grade_name + '</td>';
		$html += '<td class="right">';
		$html += '<input name="customer[' + $customer_rows + '][customer_id]" type="hidden" value="' + ui.item.value + '"/>';
		$html += '<a onclick="$(this).parent().parent().remove();" class="button"><?php echo $button_remove; ?></a>';
		$html += '</td>';
		$html += '</tr>';
		$("#tbody_customer_search").append($html);
		$customer_rows++;
		return false;
	},
	focus: function(event, ui) {
      return false;
    }
});
//--></script>
<script type="text/javascript"><!--
function send(url) { 
	$('textarea[name=\'message\']').html($('textarea[name=\'message\']').val());
	
	$.ajax({
		url: url,
		type: 'post',
		data: $('select, input, textarea'),		
		dataType: 'json',
		beforeSend: function() {
			$('#button-send').attr('disabled', true);
			$('#button-send').before('<span class="wait"><img src="view/image/loading.gif" alt="" />&nbsp;</span>');
		},
		complete: function() {
			$('#button-send').attr('disabled', false);
			$('.wait').remove();
		},				
		success: function(json) {
			$('.success, .warning, .error').remove();
			if (json['error']) {
				if (json['error']['warning']) {
					$('.box').before('<div class="warning" style="display: none;">' + json['error']['warning'] + '</div>');
					$('.warning').fadeIn('slow');
				}
				if (json['error']['subject']) {
					$('input[name=\'subject\']').after('<span class="error">' + json['error']['subject'] + '</span>');
				}	
				if (json['error']['message']) {
					$('textarea[name=\'message\']').parent().append('<span class="error">' + json['error']['message'] + '</span>');
				}									
			}			
			
			if (json['next']) {
				if (json['success']) {
					$('.box').before('<div class="success">' + json['success'] + '</div>');
					send(json['next']);
				}		
			} else {
				if (json['success']) {
					$('.box').before('<div class="success" style="display: none;">' + json['success'] + '</div>');
					$('.success').fadeIn('slow');
				}					
			}				
		}
	});
}
//--></script> 
<?php echo $footer; ?>